<route lang="json5" type="page">
{
  style: {
    navigationBarTitleText: '使用指南',
    navigationStyle: 'custom',
  },
}
</route>
<template>
  <view class="user-guide">
    <view class="fixed-bg"> </view>
    <image
      src="@/pages-sub/static/smartJobSelection/user-guide.png"
      class="w-full"
      mode="widthFix"
    />
    <view class="user-guide__container">
      <view class="user-guide__item" v-for="item in content" :key="item.index">
        <view class="user-guide__item--title">
          <text class="index">{{ item.index }}</text>
          <text class="title">{{ item.title }}</text>
        </view>
        <view class="user-guide__item--content">
          <c-parse :content="item.content" />
        </view>
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
  const content = [
    {
      index: 1,
      title: '人岗匹配系统的功能有哪些？',
      content: `
      <view>1. 系统利用您的专业、期望工作地点和毕业时间等信息，为您筛选出全国央国企的合适招聘信息。</view><br/>
      <view>2. 对于有特定公司意向的用户，可以通过输入公司名称来查找当前和往期的职位信息。</view><br/>
      <view>3. 每个职位都附有直接的申请链接，方便您复制并直接进行在线申请。</view>
    `,
    },
    {
      index: 2,
      title: '如何依据自己的专业寻找合适的职位？',
      content: `
      <view>1. 对于央国企的热门专业，您只需输入专业关键词，如“会计”、“计算机”，即可进行搜索。</view><br/>
      <view>2. 对于较为冷门的专业，如“舞蹈”、“动物学”等，由于相关职位较少，您可以在搜索时输入“不限”作为专业关键词，以查找不限制专业的职位，包括许多文员类岗位，这些岗位通常对专业背景没有特定要求。</view>
    `,
    },
    {
      index: 3,
      title: '如何获取更多可申请的职位信息？',
      content: `
      <view>在输入专业关键词和毕业信息后，您可以在职位列表页面点击“精准匹配”进行进一步筛选，根据个人需求选择具体条件，从而缩小职位范围。</view>
    `,
    },
    {
      index: 4,
      title: '如何在众多匹配的职位中找到更适合自己的？',
      content: `
      <view>在输入专业关键词和毕业信息后，您可以在职位列表页面点击“精准匹配”进行进一步筛选，根据个人需求选择具体条件，从而缩小职位范围。</view>
    `,
    },
    {
      index: 5,
      title: '如何方便地处理心仪职位的招考链接？',
      content: `
        <view>1. 您可以使用PC端微信打开小程序，并通过电脑浏览器进行操作，这样复制链接会非常方便。</view><br/>
        <view>2. 您也可以先将感兴趣的职位信息添加到收藏夹，等所有职位信息浏览完毕后，前往个人主页的“我的收藏”中查看所有收藏的职位信息，并依次复制链接进行申请。</view>
      `,
    },
    {
      index: 6,
      title: '如果在操作过程中遇到不明白的地方怎么办？',
      content: `
        <view>在小程序页面中，您可以随时联系在线导师进行咨询。我们平台的导师拥有超过五年以上的的就业辅导经验，能够在线解答您在求职过程中遇到的各种问题，且完全免费，您可以放心咨询。</view>
      `,
    },
  ];
</script>

<style lang="scss" scoped>
  .user-guide {
    &__container {
      margin: 0 32rpx 32rpx 32rpx;
      padding: 32rpx 26rpx;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0.7) 100%),
        #fefefe;
      border-radius: 20rpx;
    }
    &__item {
      margin-bottom: 48rpx;
      &--title {
        padding: 8rpx 24rpx 8rpx 0;
        background: linear-gradient(
          270deg,
          rgba(255, 128, 14, 0) 0%,
          rgba(255, 128, 14, 0.16) 100%
        );
        border-radius: 8rpx 0rpx 0rpx 8rpx;
        display: flex;
        align-items: center;
        margin-bottom: 24rpx;

        .index {
          display: inline-block;
          width: 32rpx;
          height: 32rpx;
          border-radius: 50%;
          text-align: center;
          line-height: 32rpx;
          background: $uni-color-primary;
          color: #fff;
          font-size: 24rpx;
          margin-right: 8rpx;
        }
        .title {
          font-weight: 600;
          font-size: 28rpx;
          color: $uni-color-title;
        }
      }
      &--content {
        color: $uni-color-title;
        font-size: 28rpx;
        opacity: 0.5;
      }
    }
  }
</style>
